<template>
  <div>
      <p>type : {{ type }}</p>
      <p>name: {{ $route.query.name }}</p>
      <p>age : {{ $route.query.age }}</p>
  </div>
</template>

<script>
export default {
    name: 'PandaView',
    data(){
        return { type: '大熊猫' }
    },
    // 生命周期钩子
    beforeCreate(){
        console.log( '创建前:' , this.type );
    },
    created(){
        console.log( '已创建: ' , this.type );
    },
    beforeMount(){
        console.log( '挂载前: ' , this.$el );
        console.log( document.querySelectorAll('p') );
    },
    mounted(){
        console.log( '已挂载' , this.$el );
        console.log( document.querySelectorAll('p') );
    },
    beforeUpdate(){
        console.log( '更新前' );
    },
    updated(){
        console.log( '已更新' );
    },
    beforeUnmount(){
        console.table( '卸载前' );
    },
    unmounted(){
        console.table( '已卸载' );
    }
}
</script>

<style>

</style>